
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>    
<%@ include  file="../init.jsp"%>
<!DOCTYPE html>
<html lang="zh_CN">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="Content-Language" content="zh-CN">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <meta name="description" content="shop">
    <meta name="author" content="letsun">
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>新增订单</title>

    <link rel="stylesheet" type="text/css" href="${resources}/css/submitOrder.css">
    <link rel="stylesheet" type="text/css" href="${resources}/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="${resources}/plugs/fontAwesome/4.6.3/css/font-awesome.min.css"/>
    <link rel="stylesheet" type="text/css" href="${resources}/css/jquery.gritter.css">
    <link rel="stylesheet" type="text/css" href="${resources}/css/bootstrap-sticky-footer.css">
    <link rel="stylesheet" type="text/css" href="${resources}/css/bootstrap-fix.css">
    <link rel="stylesheet" type="text/css" href="${resources}/css/foot.css">

    <style>

       #nav {
            background-color: #de2525;
        }

        #nav .logo .fore1 {
            background: url(${resources}/images/1_1.png) center no-repeat;
            width: 320px;
            background-size: 85%;
        }
        #nav input {
            padding: 6px 12px;
        }
        
    </style>
    <script src="${resources}/js/jquery.min.js"></script>
    <script src="${resources}/js/bootstrap.min.js"></script>
    <script src="${resources}/js/jquery.gritter.min.js"></script>
    <script src="${resources}/js/jquery.gritter.min.extend.js"></script>
    <script src="${resources}/js/common.js"></script>
</head>


<body>
  	<head>
		<title>提交订单</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	</head>
	<body>
	<%@ include  file="../header_1.jsp"%>
<div class="container">
    <div class="row">
   		 <div class="col-md-1">
             <%@ include file="../menu.jsp" %>
        </div>
       
        <div class="col-md-11">

            <!-- page-header -->
            <div class="page-header">
                <div class="page-comm">
                    <div class="mt">
                        <h3>创建订单</h3>
                    </div>
                    <div class="mc">
                      
                    </div>
                </div>
            </div>
            <!-- /.page-header -->
			
	            <div class="page-content">
	           	 <c:if test="${cart_list.size()>0}">
	                <div class="page-comm">
	
	                    <!--订单信息开始-->
	                    <div class="order-content">
	                        <table class="table" id="cart_list">
	                            <tbody>
	                            <c:forEach items="${cart_list}" var="List">
		                            <tr>
		                                <th colspan="3" style="border-top: none; font-weight: normal;">${List.merchant.name}</th>
		                            </tr>
		                           	<c:forEach items="${List.list}" var="itemList">
			                            <tr>
			                                <td>
			                                    <img src="${itemList.goods.picurl}" style="width:50px;height:50px;">
			                                    	${itemList.goods.name}
			                                </td>
			                                <td>
			                                    <span class="info-num">x${itemList.amount}</span>
			                                </td>
			                                <td class="text-right">
			                                    <span class="info-gold"><em class="price">￥${itemList.goods.price}</em></span>
			                                </td>
			                            </tr>
		                           </c:forEach>
	                           </c:forEach>
	                            </tbody>
	                        </table>
	                        <div class="addressSelect">
	                        	<!-- 地址不为空 -->
	                        	<c:if test="${!empty  memberAddress}">
		                            <a href="${path}/manage/myCenter/myAddress" class="addreTitle">收货地址<span class="moreAddre">更多地址<i class="fa fa-chevron-right" aria-hidden="true"></i></span></a>
		                            <p class="address">收货地址：${memberAddress.address}${memberAddress.street}</p>
	                        	</c:if>
	                        	<!-- 地址为空 -->
	                        	<c:if test="${empty  memberAddress}">
		                            <a href="${path}/manage/myCenter/myAddress" class="addreTitle">收货地址<span class="moreAddre">请点此绑定地址<i class="fa fa-chevron-right" aria-hidden="true"></i></span></a>
	                        	</c:if>
	                        </div>
	                    </div>
	                    <!--订单信息结束-->
	
	                    <div class="clearfix">
	                        
	                    </div>
	
	                </div>
                </c:if>
             	<c:if test="${cartPicked_list.size()>0}">
	                <div class="page-comm">
	                    <!--订单信息开始-->
	                    <div class="order-content">
	                        <table class="table" id="cartPicked_list">
	                            <tbody>
	                             <c:forEach items="${cartPicked_list}" var="List">
		                            <tr>
		                                <th colspan="3" style="border-top: none; font-weight: normal;">${List.merchant.name}</th>
		                            </tr>
		                            <c:forEach items="${List.list}" var="PickedList">
		                                 <tr>
			                                <td>
			                                    <img src="${PickedList.goods.picurl}" style="width:50px;height:50px;">
			                                    	${PickedList.goods.name}
			                                </td>
			                                <td>
			                                    <span class="info-num">x${PickedList.amount}</span>
			                                </td>
			                                <td class="text-right">
			                                    <span class="info-gold"><em class="price">￥${PickedList.goods.price}</em></span>
			                                </td>
				                         </tr>
		                             </c:forEach>
	                            </c:forEach>
	                            </tbody>
	                        </table>
	                        <div class="selfReceive">
	                            <div href="javascript:;" class="addreTitle">商品自提<i class="fa fa-chevron-down" aria-hidden="true"></i></div>
	                            <div class="addressSet">
	                                <label for="city">市：
	                                    <select name="" id="city" onchange="ajaxbusiness()">
	                                    	<c:forEach items="${businessDistrictList}" var="District">
	                                    		<option value="${District.id}">${District.name}</option>
	                                    	</c:forEach>
	                                    </select>
	                                </label>
	                                <label for="district">区：
	                                    <select name="" id="district" onchange="ajaxPicked()">
	                                    </select>
	                                </label>
	                                <label for="street">自提点：
	                                    <select name="" id="detailAd">
	                                    </select>
	                                </label>
	                            </div>
	                            
	                        </div>
	                    </div>
	                    </div>
                     </c:if>
                    <!--订单信息结束-->
					<div class="page-comm">
	                    <!--订单信息开始-->
	                    <div class="order-content">
	                        <div class="selfReceive">
	                            <div class="payStatus">
	                            	<!-- 手机号为空 -->
									<c:if test="${empty phone}">
	                              	  <div class="status notbind">请点此绑定手机号<span class="tel"></span></div>
									</c:if>
									<!-- 手机号为空 -->
									<c:if test="${!empty phone}">
	                              	  <div class="status">你绑定的手机号码：<span class="tel">${phone}</span></div>
									</c:if>
	                                <div class="status">支付方式：<span class="red">在线付款</span></div>
	                                <div class="status">配送方式：送货上门</div>
	                            </div>
	                        </div>
	               </div>	
					
					
                    <!--订单核算开始-->
                    <div class="ordre-summary" style="background:#FFF;text-align:left;padding:10px">
                    </div>
                    <!--订单核算结束-->

                    <div class="clearfix">
                        <div class="pull-right">
                            <span style="margin-right:10px;">应付总额：<em class="price">￥${total}</em></span>
                            <a class="btn btn-danger " onclick="submitOrder()" >提交订单</a>
                        </div>
                    </div>

                </div>
            </div>
            <!-- /.page-content -->

            <input type="hidden" value="${phone}" id="telephone">
		    <input type="hidden" id="couponRecord" value="0">
		    <input type="hidden" value="${memberAddress.id}" id="addressid">
     

        </div>
    </div>
</div>

 <%@ include  file="../footer.jsp"%>

<script type="text/javascript">
    var $path = "/shop-pc";
</script>

<script>
    function submitOrder() {
    	var addressid = $("#addressid").val();
 		var telephone = $("#telephone").val();

	  	if(telephone==""){
      		common.alert({content:"请绑定手机号码"});
         	return;
       	} 
       	if($("#cart_list tr").length>0){
	       	if(addressid==""){
	      		common.alert({content:"请绑定收货地址"});
	         	return;
	       	} 
       	}
       	if($("#cartPicked_list tr").length>0){
	       	//自提点ID
			var pickedId=$("#detailAd").val();	
	       	if(pickedId==0 || pickedId==undefined){
	       			common.alert({content:"请选择自提点"});
		         	return;
	       	}
       	}
       	
		
       	
		//优惠券ID
		var couponRecordId=$("#couponRecord").val();
		//地址ID
		var addressId=$("#addressid").val();
		
		var detailAdId=$("#detailAd").val();
		if(detailAdId==undefined){
			detailAdId=0;
		}
		$.ajax({
 	        url: "${path}/manage/commodityOrder/create",
 	        type: "post",
 	        data:{
 	        	"marketid":"${marketId}",
 	        	"addressid":addressId,
 	        	"couponRecordId":couponRecordId,
 	        	"paymode":"1",
 	        	"pickedId":detailAdId
 	        },
 	        success: function(data) {
 	        	if(data.code == "000"){
 	        		window.location.href="${path}/pay/"+data.result;
 	        	}else if(data.code == "300"){
 	        		common.alert({
					    dialog: true,
						content:data.msg
					})
 	        	}
 	        }
 	    });	
    }

    function createOrder() {
        $.ajax({
            type: "post",
            url: "/shop-pc/manage/order/create",
            data: $("#validation-form").serialize(),
            success: function (data) {
                if (data.code == 200) {
                    window.location.href = "/shop-pc/alipay/gopay/" + data.result;
                } else if (data.code == 300) {
                    //商品库存不足
                    alertDanger(data.msg);
                } else {
                    alertDanger("系统错误,请联系管理员");
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                alertDanger('网络异常');
            }
        })
    }
    $(".fa-chevron-down").on("click", function () {
        $(".addressSet").slideToggle();
    })
    $(".status.notbind").on("click", function () {
        common.alert({
            mask    :   true,
            textAlign   :   "left",
            width	:	"350px",
            title	:	"绑定新手机号",
            content	:	"<input type='text' maxlength='11' style='border: 1px solid #ddd;\
            height: 30px;\
        padding-left: 10px;\
        margin-left: 10px;\
        width: 227px;\
        float: left;' placeholder='输入新手机号' /> <button style='background-color: #0195ff;\
            color: white;\
        height: 30px;\
        line-height: 20px;\
        padding: 0 3px;\
        min-width: 82px;' onclick='verificationCode(this);'>获取验证码</button><br/> <input type='text' maxlength='11' style='    border: 1px solid #ddd;\
            margin-left: 10px;\
        margin-top: 10px;\
        width: 120px;\
        height: 30px;\
        padding-left: 10px;' placeholder='验证码' /> ",
            ok		:	function () {
                //ok按钮回掉


            },
            dialog	:	true
        });
    })
    function verificationCode() {
        alert("验证码")
    }
    
  //查询子商圈
	function ajaxbusiness(){
		$("#district").html("");
		var districtId=$("#city").val();
		$.ajax({
				url:"${path}/manage/commodityOrder/getDistrict?districtId="+districtId,
				type:"post",
				async:false,
				success:function(data){
					var html="";
					if(data.result.length>0){
						
						for(var i=0;i<data.result.length;i++){
							html+="<option value='"+data.result[i].id+"'>"+data.result[i].name+"</option>";
						}
						$("#district").html(html);
					}
			}
		})
		ajaxPicked();
	}	
	
	//查询自提点
	function ajaxPicked(){
		var districtId=$("#district").val();
		$("#detailAd").html("");
		$.ajax({
				url:"${path}/manage/commodityOrder/getPicked?districtId="+districtId,
				type:"post",
				async:false,
				success:function(data){
					if(data.result.length>0){
						var html="";
						for(var i=0;i<data.result.length;i++){
							html+="<option value='"+data.result[i].id+"'>"+data.result[i].address+"</option>";
						}
						$("#detailAd").html(html);
					}
					
			}
		})
	}	
	
	$(function(){
		ajaxbusiness();
	})
    
    
</script>
</body>
</html>